import { Button, Modal, Form, Input, Select, DatePicker } from 'antd';
import { useEffect,useState,useRef } from 'react';
import { useStore } from '../useStore';
import { http } from "@/utils/request";
import _ from "lodash"
import dayjs from 'dayjs';
const { TextArea } = Input;
export const AddEmergencyModal = () => {
  const [form] = Form.useForm();
  const [addOrEditEmergencyModal,emergencyDetailData,emergencyTable,addDataToEmergencyTable,setDataToEmergencyTable] = useStore((state)=>[
    state.addOrEditEmergencyModal,
    state.emergencyDetailData,
    state.emergencyTable,
    state.addDataToEmergencyTable,
    state.setDataToEmergencyTable
  ])
  const [title,setTitle] = useState('新增应急联系人信息')
  const handleOk = async () =>{
    const values = await form.validateFields();
    values.personId = '81800628'
    
    if(title=='新增应急联系人信息'){
      try {
        const res = await http.post({
          url: '/PmPersonContact/add',
          data: values,
        })
        if(res.code==200){
          // 校验成功，执行保存操作并关闭Modal
          useStore.setState({addOrEditEmergencyModal:{open:false}})
          addDataToEmergencyTable(values)
        }
      } catch (errorInfo) {
        console.log('Failed:', errorInfo);
      }
    }else{
      const data= JSON.parse(JSON.stringify(emergencyDetailData))
      values.id = data.id
      try {
        const res = await http.post({
          url: '/PmPersonContact/update',
          data: values,
        })
        if(res.code==200){
          // 校验成功，执行保存操作并关闭Modal
          useStore.setState({addOrEditEmergencyModal:{open:false}})
          setDataToEmergencyTable(values)
        }
      } catch (errorInfo) {
        console.log('Failed:', errorInfo);
      }
    }
  }
  const handleCancel = () =>{
    useStore.setState({addOrEditEmergencyModal:{open:false}})
  }
  useEffect(()=>{
    if(_.isEmpty(emergencyDetailData.name)){
      setTitle('新增应急联系人信息')
      form.resetFields();
    }else{
      const data= JSON.parse(JSON.stringify(emergencyDetailData))
      form.setFieldsValue(data)
      setTitle('修改应急联系人信息')
    }
  },[addOrEditEmergencyModal.open])
  return(
    <Modal title={title} open={addOrEditEmergencyModal.open} onCancel={handleCancel} footer={[
      <Button key="back" onClick={handleCancel}>
        返回
      </Button>,
      <Button type="primary" onClick={handleOk}>
        保存
      </Button>,
    ]}
    >
      <Form form={form} labelCol={{ span: 5}} wrapperCol={{ span: 16 }} autoComplete='false'>
        <Form.Item name="name" label="姓名" rules={[{ required: true, message: '请输入姓名!' }]}>
          <Input placeholder="请输入姓名" />
        </Form.Item>
        <Form.Item name="relationship" label="关系" rules={[{ required: true, message: '请输入关系!' }]}>
          <Input placeholder="请输入关系" />
        </Form.Item>
        <Form.Item name="mobilePhone" label="联系方式" rules={[{ required: true, message: '请输入联系方式!' }]}>
          <Input placeholder="请输入联系方式" />
        </Form.Item>
      </Form>

    </Modal>
  )
}